<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <meta name="renderer" content="webkit|ie-comp|ie-stand">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
  <meta http-equiv="Cache-Control" content="no-siteapp" />
  <title>外协单返回列表</title>
</head>

<body>
  <div id="app">
    <div class="return-order-table" v-loading.fullscreen.lock="loading">
      <search-btn-view btn-text="外协单返回查询" @before-open="resetSearch" @search="searchOrder(true)">
        <div slot="search-content">
          <order-search-form ref="searchForm" :search="search" :order-type="2"></order-search-form>
        </div>
        <template slot="append">
          <el-button size="medium" type="primary" @click="exportExcel">导出excel</el-button>
        </template>
      </search-btn-view>
      <div class="return-order-table-div">
        <order-table :orders="orderList" :pagination="pagination" @page-change="searchOrder(false)" @update-status="searchOrder(false)"
          @delete-order="searchOrder(false)"></order-table>
      </div>
    </div>
  </div>
</body>

<script src="../../myJs/importFile.js"></script>
<script>
  importFile([
    "/vueSystem/components/css/sysCommonSearch.css",
    "/vueSystem/components/css/searchBtnView.css",
    "../components/css/electroplateDetail.css",
    "./css/orderTable.css"
  ], [
    "/vueSystem/i18n/index.js",
    "/vueSystem/js/permissionUtil.js",
    "/vueSystem/components/sysCommonSearch.js",
    "/vueSystem/components/searchBtnView.js",
    "/vueSystem/mixins/datePickerOptionsMixin.js",
    "/vueSystem/mixins/tablePaginationMixin.js"
  ]);

</script>
<script src="../utils/moduleUtil.js"></script>
<script src="../components/electroplateDetail.js"></script>
<script src="../components/orderSearchForm.js"></script>
<script src="./orderTable.js"></script>
<script>
  var app = new Vue({
    el: '#app',
    data: function () {
      var search = {
        startTime: null,
        endTime: null,
        orderId: '',
        companyOrderId: '',
        factoryId: '',
        customerId: '',
        customerOrderId: '',
        supplierId: '',
        technology: '',
        maching: '',
        status: '',
        prodCycleList: []
      };
      return {
        loading: false,
        orderList: [],
        search: _.cloneDeep(search),
        oldSearch: _.cloneDeep(search),
        materialMachingMap: {},
        pagination: {
          currentPage: 1,
          totalCount: 0,
          pageSize: 10
        }
      };
    },
    created: function () {
      this.loading = true;
      var self = this;
      this.setMaterialMachingMap().then(function () {
        self.loading = false;
        self.searchOrder(true);
      });
    },
    methods: {
      resetSearch: function () {
        this.search = _.cloneDeep(this.oldSearch);
      },

      setMaterialMachingMap: function () {
        var self = this;
        return ModuleUtil.getMaterialMachingMap().then(function (materialMachingMap) {
          self.materialMachingMap = materialMachingMap;
          return materialMachingMap;
        }).catch(function () {
          return {};
        });
      },

      searchOrder: function (isSearch) {
        if (!isSearch) {
          this.search = _.cloneDeep(this.oldSearch);
        } else {
          this.pagination.currentPage = 1;
        }

        var pagination = this.pagination;
        var currentPage = pagination.currentPage;
        var pageSize = pagination.pageSize;
        var start = (currentPage - 1) * pageSize;

        var postData = {
          start: start,
          length: pageSize
        };
        this.setPostData(postData);

        this.loading = true;
        var self = this;
        ajaxRequest('putOutNew/getPutoutOrderReturn', postData).then(function (res) {
          if (isSearch) {
            self.oldSearch = _.cloneDeep(self.search);
          }

          var orderList = res.returnData;
          var orderGroup = _.groupBy(orderList, 'typeId');
          var orders = [];
          var materialMachingMap = self.materialMachingMap;
          for (var typeId in orderGroup) {
            var orderGroupList = orderGroup[typeId];
            var order = orderGroupList[0];
            order = _.cloneDeep(order);
            var type = order.type;
            if (type !== 0) {
              var maching;
              if (type === -1) {
                maching = '整架';
              } else {
                maching = materialMachingMap[type];
              }
              order.maching = maching;
              var color = ModuleUtil.getOutOrderFrameColor(orderGroupList);
              order.color = color;
            }
            order.id = typeId;

            var hasEleOrder = order.additionalMaterialType !== '';
            if (hasEleOrder) {
              for (var i = 0; i < orderGroupList.length; i++) {
                var obj = orderGroupList[i];
                obj.additionalColor = obj.color;
              }
            }
            order.mergeOrders = orderGroupList;
            order.hasEleOrder = hasEleOrder;
            orders.push(order);
          }

          for (var i = 0; i < orders.length; i++) {
            var order = orders[i];
            order.returenTime = SysUtil.formatString2Date(order.returenTime);
            order.approvalTime = SysUtil.formatString2Date(order.approvalTime);

            if (order.valuationCount === null) {
              order.valuationCount = order.returnCount;
            }

            var valuationCount = order.valuationCount;
            var unitPrice = order.unitPrice;
            totalMoney = _.round(valuationCount * unitPrice, 2);
            order.totalMoney = totalMoney;
          }
          self.orderList = orders;
          self.pagination.totalCount = res.iTotalRecords;
          self.loading = false;
        }).catch(function () {
          self.loading = false;
        });
      },

      exportExcel: function () {
        this.search = _.cloneDeep(this.oldSearch);
        var postData = {};
        this.setPostData(postData);
        var formParam = SysUtil.formatFormParam(postData);
        var basePath = SysUtil.getBasePath();
        var path = `${basePath}/putOutNew/downlodePutOutReturn?${formParam}`;
        window.open(path);
      },

      setPostData: function (postData) {
        var search = this.search;

        var startTime = search.startTime;
        if (startTime !== null) {
          postData.startTime = moment(startTime).format('YYYY-MM-DD');
        }

        var endTime = search.endTime;
        if (endTime !== null) {
          postData.endTime = moment(endTime).format('YYYY-MM-DD');
        }
        var fields = ['orderId', 'companyOrderId', 'factoryId', 'customerId', 'customerOrderId', 'machining',
          'supplierId', 'technology', 'status'
        ];
        SysUtil.setPostData(postData, search, fields);
      }
    },
    components: {
      OrderSearchForm: OrderSearchForm,
      OrderTable: OrderTable,
      SearchBtnView: SearchBtnView
    }
  });

</script>
<style>
  .return-order-table {
    padding: 10px 20px;
    height: calc(100% - 20px);
  }

  .return-order-table .return-order-table-div {
    height: calc(100% - 46px);
    overflow: auto;
  }

</style>

</html>
